<template>
  <!--查询所有-->
  <el-table
      ref="multipleTableRef"
      :data="tableData"
      style="width: 100%"
  >
    <el-table-column type="selection" width="55" />
    <el-table-column property="id" label="ID" width="用户id" />
    <el-table-column property="userName" label="用户名称"/>
    <el-table-column property="password" label="用户密码" />
    <el-table-column property="email" label="用户邮箱"/>
    <el-table-column property="phone" label="手机号"/>
    <el-table-column property="nickName" label="用户昵称"/>
    <el-table-column prop="avatarUrl" label="头像">
      <template #default="scope">
        <img :src="scope.row.avatarUrl" alt="头像" style="width: 50px;height: 50px;">
      </template>
    </el-table-column>
    <el-table-column label="操作" width="200">
      <template #default="scope">
        <el-button @click="dongjie1(scope.row)" type="text" size="small" class="action-button" v-if="scope.row.status == 0">恢复</el-button>
        <el-button @click="huifu(scope.row)" type="text" size="small" class="action-button" v-if="scope.row.status == 1">冻结</el-button>
      </template>

    </el-table-column>
  </el-table>
</template>
<script setup>
import { ref, onMounted } from 'vue'

import {requestException} from "@/utils/request.js"
import {ElMessage} from "element-plus";

// 数据相关
const tableData = ref([])
const loading = ref(false)
const total = ref(0)

// 获取表格数据
// 查询所有

function selectAll(){
  requestException({
url:'/admin/user/selectAll',
method:'get'
}).then(res=>{
console.log(res)
tableData.value=res.data.data

})
}
selectAll()
function dongjie1(row){
  requestException({
    url:'/admin/user/update',
    method:'post',
    params:{
      id:row.id
    }
  }).then(res=>{
    if(res.status==200){
      ElMessage({
        type: 'success',
        message: '冻结成功'
      })
      selectAll()
    }
  })


}
function huifu(row){
  requestException({
    url:'/admin/user/update',
    method:'post',
    params:{
      id:row.id
    }
  }).then(res=>{
    if(res.status==200){
      ElMessage({
        type: 'success',
        message: '恢复成功'
      })
      selectAll()
    }
  })
}
</script>